<template>
  <el-card shadow="hover">
    <div class="welcome">欢迎使用校园信息管理系统</div>
    <div class="dashboard">
      <el-row :gutter="20">
        <el-col :span="8">
          <el-card shadow="hover">
            <div class="stat-card">
              <div class="stat-title">学生总数</div>
              <div class="stat-value">1,234</div>
            </div>
          </el-card>
        </el-col>
        <el-col :span="8">
          <el-card shadow="hover">
            <div class="stat-card">
              <div class="stat-title">新闻数量</div>
              <div class="stat-value">56</div>
            </div>
          </el-card>
        </el-col>
      </el-row>
    </div>
  </el-card>
</template>

<script>
export default {
  name: 'HomeIndex'
}
</script>

<style scoped>
.welcome {
  font-size: 24px;
  text-align: center;
  padding: 20px 0;
}
.stat-card {
  text-align: center;
  padding: 20px;
}
.stat-title {
  font-size: 16px;
  color: #909399;
}
.stat-value {
  font-size: 24px;
  margin-top: 10px;
}
</style>